<template>
<div class="Tools">
  <el-row :gutter="10">
    <el-col :xs="8" :sm="6" :md="4" :lg="3" :xl="1" v-for="(item,index) in toolslist">
      <el-card class="box-card" >
        <router-link :to="item.url">
          <div  class="text item">
            <i class="el-icon-picture"></i>
            <h3>{{item.title}}</h3>
          </div>
        </router-link>
      </el-card>
    </el-col>
  </el-row>
</div>
</template>

<script>
  export default {
    data () {
      return {
         toolslist:[
           // {
           //   title:"在线代码编辑器" ,url:"/onlineTools/coderunner"
           // },
           // {
           //   title:"在线图片编辑" ,url:"/onlineTools/imageEdit"
           // },
            {
              title:"获取网页图片" ,url:"/onlineTools/getImage"
            },
         ]
      }
    },
    mounted () {
      this.getDatas()
      
    },
    methods: {
      
      getDatas() {
        let params = {

        };
        this.$api.getNews(params)
         .then(res => {
           console.log(res)
            this.articleList = res.data
         })
      },
     
    },
    components: {

    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang='less' scoped>

@import './index.less';

</style>
